<template>
  <el-table :data="tableData">
    <el-table-column label="任务" prop="task">
      <template #default="{ row }">
        <el-tooltip
          v-if="row.isNotMyTask"
          class="item"
          effect="dark"
          content="不可操作"
          placement="top">
          <span class="task-text" :class="{ 'disabled-task': row.isNotMyTask }">
            {{ row.task }}
          </span>
        </el-tooltip>
        <span v-else>{{ row.task }}</span>
      </template>
    </el-table-column>
  </el-table>
</template>

<script>
export default {
  data() {
    return {
      tableData: [
        { task: "任务1", isNotMyTask: false },
        { task: "任务2", isNotMyTask: true },
        { task: "任务3", isNotMyTask: false },
      ],
    };
  },
};
</script>

<style scoped>
.disabled-task {
  color: #ccc;
  cursor: not-allowed;
}
</style>

